<template>
    <div>
         <Modal
        v-model="modal1"  width="1200"
        title="综合统计"
>
  <!-- <div class="pageWrap1" id="ComprehensiveStatistics">
		<Row class="pageHeader1">
			<h2 class="title">综合统计</h2>
			<div style="float:right;">
			</div>
		</Row> -->
        <div class="box">
            <div class="list"> 
                <div class="title">考试列表</div>
                <div style="width: 100%;overflow-y: auto; max-height: calc(100% - 125px);">
                    <Table border :columns="userExammCol" :data="userExamList"  class="table"
                    @on-select="selectSignalExam"  @on-select-cancel="cancelSelectSignalExam" @on-select-all="selectAllExam" @on-select-all-cancel="cancelSelectAllExam"></Table>
                </div>
                <div class="weight" > 
                     <Page  :current="pageIndexExam" :total="ExamTotal" :page-size="pageSizeExam" show-total show-elevator @on-change="examListChange"/>
                    <div style="display: flex;font-size: 16px; font-weight: 700;justify-content: space-around;margin-top:10px" v-if="addExamArr.length>0">
                        <div>考试权重： <Input v-model.trim="weight.examWeight" placeholder="请输入考试权重"  style="width:60px;display:inline-block;"  ></Input></div>
                    </div>
                </div>
            </div>

            <div class="list">
              <div class="title">教学列表</div>
              <div style="width: 100%;overflow-y: auto; max-height: calc(100% - 125px);">
                <Table border :columns="classCol" :data="classList"  class="table"
                       @on-select="selectSignalCompet"  @on-select-cancel="cancelSelectSignalCompet" @on-select-all="selectAllCompet" @on-select-all-cancel="cancelSelectAllCompet"></Table>
              </div>
              <div class="weight" >
                <Page  :current="pageIndexClass" :total="classTotal" :page-size="pageSizeExam" show-total show-elevator @on-change="competListChange"/>
                <div style="display: flex;font-size: 16px; font-weight: 700;justify-content: space-around;margin-top:10px" v-if="classList.length>0">
                  <div>教学权重： <Input v-model.trim="weight.classWeight" placeholder="请输入教学权重"  style="width:60px;display:inline-block;"></Input></div>
                </div>
              </div>
            </div>
          
            <div class="list"  v-if="!hideCompet">
                <div class="title">竞赛列表</div>
                <div style="width: 100%;overflow-y: auto; max-height: calc(100% - 125px);">
                    <Table border :columns="userCompetCol" :data="userCompetList"  class="table"
                    @on-select="selectSignalCompet"  @on-select-cancel="cancelSelectSignalCompet" @on-select-all="selectAllCompet" @on-select-all-cancel="cancelSelectAllCompet"></Table>
                </div>
                <div class="weight" > 
                     <Page  :current="pageIndexCompet" :total="competTotal" :page-size="pageSizeExam" show-total show-elevator @on-change="competListChange"/>
                    <div style="display: flex;font-size: 16px; font-weight: 700;justify-content: space-around;margin-top:10px" v-if="addCompetArr.length>0">
                        <div>竞赛权重： <Input v-model.trim="weight.competWeight" placeholder="请输入竞赛权重"  style="width:60px;display:inline-block;"></Input></div>
                    </div>
                </div>
            </div>
            <div class="list" v-if="!hideCompet">
                <div class="title">演练列表</div>
                <div style="width: 100%;overflow-y: auto; max-height: calc(100% - 125px);">
                    <Table border :columns="userCompetCol1" :data="userDrillList"  class="table"
                    @on-select="selectSignalDrill"  @on-select-cancel="cancelSelectSignalDrill" @on-select-all="selectAllDrill" @on-select-all-cancel="cancelSelectAllDrill"></Table>
                </div>
                <div class="weight" > 
                     <Page  :current="pageIndexDrill" :total="drillTotal" :page-size="pageSizeDrill" show-total show-elevator @on-change="drillListChange"/>
                    <div style="display: flex;font-size: 16px; font-weight: 700;justify-content: space-around;margin-top:10px" v-if="addDrillArr.length>0">
                        <div>演练权重： <Input v-model.trim="weight.drillWeight" placeholder="请输入演练权重"  style="width:60px;display:inline-block;"></Input></div>
                    </div>
                </div>
            </div>
        </div>
        <div slot="footer">
            <Button @click="cancel" type="primary" >取消</Button>
            <Button @click="Reporting" type="primary" >生成报告</Button>
        </div>
     </Modal>
    </div>
	<!-- </div> -->
</template>

<script>

import {getUserExamByPage,queryClassByexp } from '@/api/experimenterTrack.js' 
import {getExpCompeteList } from '@/api/compitionStatic.js'
export default {
    		props:['companyName','username'],
    data(){
        return{
            hideCompet:this.hideCompet,
            userId:'',
            modal1:false,
             //演练
            pageIndexDrill:1,
            pageSizeDrill:10,
            drillTotal:0,
            userDrillList:[],
            addDrillArr:[],
             //竞赛
            pageIndexCompet:1,
            pageSizeCompet:10,
            competTotal:0,


            //竞赛
            pageIndexClass:1,
            pageSizeClass:10,
            classTotal:0,
            classList:[],
            userCompetList:[],
            addCompetArr:[],
            //考试
            pageIndexExam:1,
            pageSizeExam:10,
             ExamTotal:0,
            userExamList:[],
            addExamArr:[],
            weight:{
                examWeight:0,
                competWeight:0,
                drillWeight:0,
              classWeight:0
            },
            userExammCol:[
                 {
                    type:'selection',
                    width:60,
                    align:'left',
                    render:(h,params)=>{
                        return h('div',{
                            style:{
                                display:'none'
                            }
                        })
                    }
                },
                {
                    title:'考试名称 ',
                    key:'examinationName',
                    align:'left'
                }
                
                // {
                //         title:'类型',
                //         key:'type',
                //         align:'left',
                //         render:(h,params)=>{
                //             return h('span',this.setType(params.row))
                //         }
                // },
            ],
            classCol:[
              {
                type:'selection',
                width:60,
                align:'left',
                render:(h,params)=>{
                  return h('div',{
                    style:{
                      display:'none'
                    }
                  })
                }
              },
              {
                title:'教学名称 ',
                key:'egName',
                align:'left'
              }
            ],
          
          
            userCompetCol:[
                 {
                    type:'selection',
                    width:60,
                    align:'left',
                    render:(h,params)=>{
                        return h('div',{
                            style:{
                                display:'none'
                            }
                        })
                    }
                },
                {
                    title:'竞赛名称 ',
                    key:'name',
                    align:'left'
                }
            ],
             userCompetCol1:[
                 {
                    type:'selection',
                    width:60,
                    align:'left',
                    render:(h,params)=>{
                        return h('div',{
                            style:{
                                display:'none'
                            }
                        })
                    }
                },
                {
                    title:'演练名称 ',
                    key:'name',
                    align:'left'
                }
            ]
        }
    },
    created(){
        // this.userId=this.$route.query.id
    },
    watch: {
			// 'userId': {
			// 	immediate: true,
			// 	deep: true,
			// 	handler: function(newVal){
			// 		if (newVal && !newVal.flagTxt) {
			// 			 this.userDrillList=[]
            //             this.addDrillArr=[]
            //             this.userCompetList=[]
            //             this.addCompetArr=[]
            //             this.userExamList=[]
            //             this.addExamArr=[]
			// 		}
			// 	}
			// }
		},
    mounted(){
      
    },
    methods:{
       getClassList(){
         this.classList=[]

         let paramas={
           userId:this.userId,
           page:this.pageIndexClass,
           rows:this.pageSizeClass,
           // status:1
         }
         queryClassByexp(paramas).then(res=>{
           console.log('---------------getUserExamByPage-------',res)
           if(res.code==1){
             this.classList=res.data.items
             this.classTotal=res.data.total
           }else{
             this.$Message.warning(res.message)
           }
         })
       },  
      
          
          
        cancel(){
            this.modal1=false
            this.addDrillArr=[]
            this.addCompetArr=[]
            this.addExamArr=[]
        },
        Reporting(){
            // console.log(this.addDrillArr,'addDrillArraddDrillArraddDrillArraddDrillArr');
            // console.log(this.addCompetArr,'addCompetArraddCompetArraddCompetArraddCompetArraddCompetArr');
            //   console.log(this.userId,'addDrillArraddDrillArraddDrillArraddDrillArr');
            // console.log(this.username,'addCompetArraddCompetArraddCompetArraddCompetArraddCompetArr');
            localStorage.setItem('generateReportIds', JSON.stringify(this.addExamArr))
            localStorage.setItem('addDrillArrIds', JSON.stringify(this.addDrillArr))
            localStorage.setItem('addCompetArrIds', JSON.stringify(this.addCompetArr))
            if(this.addExamArr.length>0&&!this.weight.examWeight>0){
                this.$Message.warning('考试权重不能为零')
                return
            }
            if(this.addCompetArr.length>0&&!this.weight.competWeight>0 && (!this.hideCompet)){
                this.$Message.warning('竞赛权重不能为零')
                return
            }
            if(this.addDrillArr.length>0&&!this.weight.drillWeight>0 && (!this.hideCompet)){
                this.$Message.warning('演练权重不能为零')
                return
            }
            if(this.addDrillArr.length==0&&this.addExamArr.length==0&&this.addCompetArr.length==0){
                this.$Message.warning('请至少勾选一项并填写相应权重')
                return
            }
            let tatal= 0 
            for(let kw in this.weight){
              tatal += parseInt(this.weight[kw])
            }
            console.log('权重总数啊啊',tatal)
            if(tatal!=100){
                 this.$Message.warning('所有填写权重相加必须为100')
                return
            }
            const {
				href
			} = this.$router.resolve({
				name: 'statisticalReport',
				query: {
					userId: this.userId,
					username: this.username,
                    companyName: this.companyName,
                    examinationRate:this.weight.examWeight,
                    contestRate:this.weight.competWeight,
                    drillRate:this.weight.drillWeight,
                    classRate:this.weight.classWeight,
                    weight:this.weight
				}
			});
			window.openTrain(href, '_blank')
        },
        init(id){
            this. weight={
                examWeight:0,
                competWeight:0,
                drillWeight:0,
                classWeight:0,
            },
            this.userId=id
            this.modal1=true
            this.userDrillList=[]
            this.addDrillArr=[]
            this.userCompetList=[]
            this.addCompetArr=[]
            this.userExamList=[]
            this.classList=[]
            this.addExamArr=[]
             this.pageIndexDrill=1
            this.pageIndexCompet=1
            this.pageIndexExam=1
            this.pageIndexClass=1
            this.classTotal=0
            this.getExpDrillList()
            this.getExpCompeteList()
            this.getUserExamList()
            this.getClassList()
           
        },
        changeModalStatus(){
            this.Model=false
        },
        getExpDrillList(){
            let params={
                pageIndex:this.pageIndexDrill,
                pageSize:this.pageSizeDrill,
                userId:this.userId,
                type:1
            }
            getExpCompeteList(params).then(res=>{
                if(res.code==1){
                    this.userDrillList=res.data.items
                    this.drillTotal=res.data.total
                    for(let i=0;i<this.userDrillList.length;i++){
                        this.userDrillList[i]._checked = false
                        let id= this.userDrillList[i].id
                        if(this.addDrillArr.indexOf(id) > -1){
                            this.userDrillList[i]._checked = true
                        }
                    }
                }else{
                    this.$Message.warning(res.message)
                }
            })
        },
         getExpCompeteList(){
            let params={
                pageIndex:this.pageIndexCompet,
                pageSize:this.pageSizeCompet,
                userId:this.userId,
                type:0
            }
            getExpCompeteList(params).then(res=>{
                if(res.code==1){
                    this.userCompetList=res.data.items
                    for(let i=0;i<this.userCompetList.length;i++){
                        this.userCompetList[i]._checked = false
                        let id= this.userCompetList[i].id
                        if(this.addCompetArr.indexOf(id) > -1){
                            this.userCompetList[i]._checked = true
                        }
                    }
                    this.competTotal=res.data.total
                }else{
                    this.$Message.warning(res.message)
                }
            })
        },
        //获取考试列表
        getUserExamList(){
            let paramas={
                // userId:this.userId,
                page:this.pageIndexExam,
                rows:this.pageSizeExam,
                status:1
            }
            getUserExamByPage(this.userId,paramas).then(res=>{
                if(res.code==1){
                    this.userExamList=res.attribute.dataList
                    console.log(this.addExamArr,'this.addExamArrthis.addExamArr');
                     for(let i=0;i<this.userExamList.length;i++){
                        this.userExamList[i]._checked = false
                        let id= this.userExamList[i].examinationId
                        console.log(456);
                        if(this.addExamArr.indexOf(id) > -1){
                            console.log(123);
                            this.userExamList[i]._checked = true
                        }
                    }
                    this.ExamTotal=res.attribute.totalCount
                }else{
                    this.$Message.warning(res.message)
                }
            })
        },
        selectSignalExam(val,row){
                        console.log(this.addExamArr,'addExamArraddExamArr');
             let id= row.examinationId
            if(this.addExamArr.indexOf(id) <= -1){
                this.addExamArr.push(id)
                this.ExamStatus(row,true)
            }
            console.log(this.addExamArr,'addExamArraddExamArr');
        },
        cancelSelectSignalExam(val,row){
            let id= row.examinationId
              if(this.addExamArr.indexOf(id) > -1){
                let index = this.addExamArr.indexOf(id)
                console.log(index);
                this.addExamArr.splice(index,1)
                 this.ExamStatus(row,false)
            }
            console.log(this.addExamArr,'addExamArraddExamArr');
            if(this.addExamArr.length==0){
                this.weight.examWeight=0
            }
        },
        selectAllExam(val){
             for(let i=0;i<this.userExamList.length;i++){
                 let id= this.userExamList[i].examinationId
                  this.$set(this.userExamList[i],'_checked',true)
                if(this.addExamArr.indexOf(id) <= -1 ){
                    this.addExamArr.push(id)
                }
            }
            console.log(this.addExamArr,'addExamArraddExamArr');
        },
        cancelSelectAllExam(val){
           for(let i=0;i<this.userExamList.length;i++){
                 let id= this.userExamList[i].examinationId
                  this.$set(this.userExamList[i],'_checked',false)
                if(this.addExamArr.indexOf(id) > -1 ){
                     let index = this.addExamArr.indexOf(id)
                    this.addExamArr.splice(index,1)
                }
            }
            if(this.addExamArr.length==0){
                this.weight.examWeight=0
            }
            console.log(this.addExamArr,'this.addExamArrthis.addExamArr');
        },
        ExamStatus(val,status){
            for(let i=0;i<this.userExamList.length;i++){
                if(val.examinationId === this.userExamList[i].examinationId){
                    this.$set(this.userExamList[i],'_checked',status)
                }
            }
        },
        examListChange(val){
            this.pageIndexExam=val
            this.getUserExamList()
        },
        //竞赛
        selectSignalCompet(val,row){
            let id= row.id
            if(this.addCompetArr.indexOf(id) <= -1){
                this.addCompetArr.push(id)
                this.CompetStatus(row,true)
            }
        },
        cancelSelectSignalCompet(val,row){
            let id= row.id
            if(this.addCompetArr.indexOf(id) > -1){
                let index = this.addCompetArr.indexOf(id)
                this.addCompetArr.splice(index,1)
                    this.CompetStatus(row,false)
            }
            if(this.addCompetArr.length==0){
                this.weight.competWeight=0
            }
        },
        selectAllCompet(val){
             for(let i=0;i<this.userCompetList.length;i++){
                 let id= this.userCompetList[i].id
                  this.$set(this.userCompetList[i],'_checked',true)
                if(this.addCompetArr.indexOf(id) <= -1 ){
                    this.addCompetArr.push(id)
                }
            }
        },
        cancelSelectAllCompet(val){
            for(let i=0;i<this.userCompetList.length;i++){
                 let id= this.userCompetList[i].id
                  this.$set(this.userCompetList[i],'_checked',false)
                if(this.addCompetArr.indexOf(id) > -1 ){
                     let index = this.addCompetArr.indexOf(id)
                    this.addCompetArr.splice(index,1)
                }
            }
            if(this.addCompetArr.length==0){
                this.weight.competWeight=0
            }
        },
        CompetStatus(val,status){
            for(let i=0;i<this.userCompetList.length;i++){
                if(val.id === this.userCompetList[i].id){
                    this.$set(this.userCompetList[i],'_checked',status)
                }
            }
        },
        competListChange(val){
            this.pageIndexCompet=val
            this.getExpCompeteList()
        },
        //演练
        selectSignalDrill(val,row){
            let id= row.id
            if(this.addDrillArr.indexOf(id) <= -1){
                this.addDrillArr.push(id)
                this.CompetStatus(row,true)
            }
        },
        cancelSelectSignalDrill(val,row){
            let id= row.id
            if(this.addDrillArr.indexOf(id) > -1){
                let index = this.addDrillArr.indexOf(id)
                this.addDrillArr.splice(index,1)
                    this.CompetStatus(row,false)
            }
            if(this.addDrillArr.length==0){
                this.weight.drillWeight=0
            }
        },
        selectAllDrill(val){
             for(let i=0;i<this.userDrillList.length;i++){
                 let id= this.userDrillList[i].id
                  this.$set(this.userDrillList[i],'_checked',true)
                if(this.addDrillArr.indexOf(id) <= -1 ){
                    this.addDrillArr.push(id)
                }
            }
        },
        cancelSelectAllDrill(val){
            for(let i=0;i<this.userDrillList.length;i++){
                 let id= this.userDrillList[i].id
                  this.$set(this.userDrillList[i],'_checked',false)
                if(this.addDrillArr.indexOf(id) > -1 ){
                     let index = this.addDrillArr.indexOf(id)
                    this.addDrillArr.splice(index,1)
                }
            }
            if(this.addDrillArr.length==0){
                this.weight.drillWeight=0
            }
        },
        drillStatus(val,status){
            for(let i=0;i<this.userDrillList.length;i++){
                if(val.id === this.userDrillList[i].id){
                    this.$set(this.userDrillList[i],'_checked',status)
                }
            }
        },
        drillListChange(val){
            this.pageIndexDrill=val
            this.getExpDrillList()
        },
    }
}
</script>

<style scoped>
.pageWrap1 {
    margin: 30px;
    background: #fff;
    height: calc(100vh - 60px);
    border-radius: 10px;
}

.pageHeader1 {
    padding: 20px 20px 0 20px;
    height: 47px;
}

.pageHeader1 .title {
    float: left;
    font-size: 18px;
}
.box{
     /* width: 100%; */
     /* height: calc(100% - 47px); */
     display: flex;
     justify-content: space-around;
}
.list{
    /* border: 1px solid black; */
    /* height: 100%; */
    display: inline-block;
    width: 33%;
    /* overflow:auto; */
    /* position: relative; */
}
.box .title{
    text-align: center;
    font-size: 20px;
    font-weight: 700;
    height: 30px;
}
.table{
   
    /* width: calc(100% - 2px); */
    margin-bottom:10px;
}
.weight{
    height: 85px;
   /* line-height: 160px; */
    margin-top: 10px;
    text-align:center;
    margin-bottom:20px;
}
</style>